<div class="main-container">
    <div class="header">
        <!--<p class="sub-title">服务项目</p>-->
        <!--<div class="short-line"></div>-->
        <p class="main-title">{{manageName}}综合调度管理平台</p>
        <div class="remarks">{{remarks}}</div>
    </div>

    <div class="menu-container">
        <div class="menu-box" (click)="navigateToSys('gate')">
            <div class="box-wrap">
                <div class="menu-icon gate-icon"></div>
                <p class="title-zh">闸门自动监控</p>
                <p class="title-en">Automatic Gate Monitoring</p>
                <div class="sub-menus-box">
                    <span class="sub-menu" *ngFor="let subMenu of gateSubMenus"
                          (click)="navigateToSubMenu(subMenu.href, 'gateMenuList')">
                        {{ subMenu.name }}
                    </span>
                </div>
            </div>
        </div>
        <div class="menu-box" (click)="navigateToSys('wrs')">
            <div class="box-wrap">
                <div class="menu-icon wrs-icon"></div>
                <p class="title-zh">水资源调度</p>
                <p class="title-en">Water Resources Dispatch</p>
                <div class="sub-menus-box">
                    <span class="sub-menu" *ngFor="let subMenu of wsSubMenus"
                          (click)="navigateToSubMenu(subMenu.href, 'wsMenuList')">
                        {{ subMenu.name }}
                    </span>
                </div>
            </div>
        </div>
        <div class="menu-box" (click)="navigateToSys('pm')">
            <div class="box-wrap">
                <div class="menu-icon pm-icon"></div>
                <p class="title-zh">工程管理</p>
                <p class="title-en">Engineering Management</p>
                <div class="sub-menus-box">
                    <span class="sub-menu" *ngFor="let subMenu of pmSubMenus"
                          (click)="navigateToSubMenu(subMenu.href, 'pmMenuList')">
                        {{ subMenu.name }}
                    </span>
                </div>
            </div>
        </div>
        <div class="menu-box" (click)="navigateToSys('sf')">
            <div class="box-wrap">
                <div class="menu-icon sf-icon"></div>
                <p class="title-zh">安全生产</p>
                <p class="title-en">Safe Production</p>
                <div class="sub-menus-box">
                    <span class="sub-menu" *ngFor="let subMenu of sfSubMenus"
                          (click)="navigateToSubMenu(subMenu.href, 'sfMenuList')">
                        {{ subMenu.name }}
                    </span>
                </div>
            </div>
        </div>
        <div class="menu-box" (click)="navigateToSys('map')">
            <div class="box-wrap">
                <div class="menu-icon map-icon"></div>
                <p class="title-zh">灌区一张图</p>
                <p class="title-en">A Picture of Irrigation Area</p>
            </div>
        </div>
    </div>

    <div class="qr-code">
        <img src="assets/images/portal/qrcode.png" alt="app下载">
        <p>APP二维码</p>
    </div>

    <div class="footer">
        <span class="link" *ngFor="let link of linkList" (click)="jumpToLink(link.href)">
            <img src="assets/images/portal/portal-link-icon.png" alt="">
            {{ link.name }}
        </span>
    </div>
</div>
